<template>
  <div class="app-container">
    <div id="map"></div>
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="108px"
    >
      <!-- <el-form-item label="门店名称" prop="showOrNot">
        <el-select clearable v-model="queryParams.storeName">
          <el-option
            v-for="(item, index) of postione"
            :key="index"
            :label="item.value"
            :value="item.key"
            >{{ item.value }}</el-option
          >
        </el-select>
      </el-form-item> -->
      <el-form-item label="退单规则名称" prop="storeName">
        <el-input
          v-model="queryParams.storeName"
          placeholder="请输入门店名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          v-hasPermi="['business:ChargebackRule:query']"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['business:ChargebackRule:add']"
          >新增</el-button
        >
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
        >修改</el-button>
      </el-col> -->
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['business:ChargebackRule:del']"
          >批量删除</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <el-table
      v-loading="loading"
      :data="storeList"
      max-height="650px"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <!-- <el-table-column
        label="适用门店"
        align="center"
        prop="storeName"
        width="120"
      >
      <template slot-scope="scope">
        {{ scope.row.storeName || '--' }}
      </template>
      </el-table-column> -->
      <el-table-column
        label="退单规则名称"
        align="center"
        prop="chargebackName"
      />
      <el-table-column label="退单方式" align="center" prop="chargebackWay" />
      <el-table-column label="技师提成比例" align="center" prop="commissionRate" />


      <el-table-column label="自动退款时间段" align="center" prop="chargebackTime" >
        <template slot-scope="scope">
          {{ scope.row.chargebackTime || "--" }}
        </template>
      </el-table-column>

      <el-table-column label="扣款比例" align="center" prop="chargebackScale">
        <template slot-scope="scope">
          {{ scope.row.chargebackScale || "--" }}
        </template>
      </el-table-column>


      <el-table-column label="状态" align="center" prop="status" width="120">
        <template slot-scope="scope">
          <span>{{ scope.row.status == "1" ? "启用" : "禁用" }}</span>
        </template>
      </el-table-column>
      <el-table-column label="创建人"   align="center"  prop="createBy" />
      <el-table-column label="创建时间"   align="center"  prop="createTime" />
      <el-table-column label="修改人"   align="center"  prop="updateBy" />
      <el-table-column label="修改时间"   align="center"  prop="updateTime" />

      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['business:ChargebackRule:edit']"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-upload2"
            @click="handleGround(scope.row, (status = 1))"
            v-hasPermi="['business:ChargebackRule:open']"
            :disabled="scope.row.status === 1"
            >启用</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-download"
            @click="handleGround(scope.row, (status = 2))"
            v-hasPermi="['business:ChargebackRule:disabled']"
            :disabled="scope.row.status === 2"
            >禁用</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['business:ChargebackRule:del']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <!-- 添加或修改门店对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="open"
      width="980px"
      append-to-body
      :close-on-click-modal="false"
    >
      <el-form
        v-if="open"
        ref="form"
        :model="form"
        :rules="rules"
        label-width="120px"
        :validate-on-rule-change="false"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="退单规则名称"
              prop="chargebackName"
              label-width="170px"
            >
              <el-input
                v-model="form.chargebackName"
                placeholder="请输入退单规则名称"
                style="width: 222px"
              />
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
        <el-form-item label="状态" prop="status">
          <el-select clearable v-model="form.status">
            <el-option
              v-for="(item, index) of List"
              :key="index"
              :label="item.value"
              :value="item.key"
              >{{ item.value }}</el-option
            >
          </el-select>
        </el-form-item>
        </el-col> -->
        </el-row>
        <!-- 退单方式 -->
        <div>
          <!-- <el-row>
            <el-form-item label="退单方式：" label-width="180px">
            </el-form-item>
          </el-row> -->
          <el-row>
            <el-col :span="12">
              <el-form-item label="退单方式" label-width="170px">
                <el-radio-group
                  v-model="form.chargebackWay"
                  @change="handleChange"
                >
                  <el-radio :label="1">小程序手动退单</el-radio>
                  <el-radio :label="2">系统自动退单</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <!-- 自动退单 -->
        <div v-if="form.chargebackWay === 2">
          <div>
            <el-row>
              <el-col :span="12">
                <el-form-item
                  label="服务时间开始后"
                  prop="chargebackTime"
                  label-width="170px"
                >
                  <div style="display: flex; align-items: center; height: 36px">
                    <el-input
                      onkeyup="value = value.replace(/[^\d.]/g, '')"
                      v-model="form.chargebackTime"
                      placeholder="请输入自动退单时间"
                      style="width: 222px"
                    />
                    <span class="unit">分钟内</span>
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="此处设置服务开始后N分钟内未点击【上钟】按钮系统将自动为客户退单，同时释放技师服务时间"
                      placement="top"
                    >
                      <i class="el-icon-warning" style="color: #f7453e"></i>
                    </el-tooltip>
                  </div>
                </el-form-item>
              </el-col>
              <el-col :span="11" style="display: flex">
                <el-form-item label="扣款比例" prop="chargebackScale">
                  <div style="display: flex; align-items: center; height: 36px">
                    <el-input
                      onkeyup="value = value.replace(/[^\d.]/g, '')"
                      v-model="form.chargebackScale"
                      placeholder="请输入扣款比例"
                      style="width: 222px"
                    />
                    <span class="unit">%</span>
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="按项目实付金额计算"
                      placement="top"
                    >
                      <i class="el-icon-warning" style="color: #f7453e"></i>
                    </el-tooltip>
                  </div>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </div>
        <!-- <el-row>
          <el-col :span="12">
            <el-form-item label="归属门店" prop="storeId">
              <el-select
                clearable
                v-model="form.storeId"
                @change="changePostione"
              >
                <el-option
                  v-for="(item, index) of postione"
                  :key="index"
                  :label="item.value"
                  :value="item.key"
                  >{{ item.value }}</el-option
                >
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="规则类型" prop="chargebackType">
              <el-select
                clearable
                v-model="form.chargebackType"
                @change="changeType"
              >
                <el-option
                  v-for="(item, index) of Type"
                  :key="index"
                  :label="item.value"
                  :value="item.key"
                  >{{ item.value }}</el-option
                >
              </el-select>
            </el-form-item>
          </el-col>
        </el-row> -->

        <div v-if="form.chargebackWay === 1">
          <!-- 项目开始前退单规则 -->
          <div>
            <el-row>
              <el-form-item label="服务时间开始前：" label-width="180px">
              </el-form-item>
            </el-row>
            <el-row>
              <!-- <el-col :span="12">
            
            <el-form-item label="是否扣费" label-width="170px">
              <el-radio-group v-model="form.chargeBeforeType">
                <el-radio  :label=2>是</el-radio>
                <el-radio  :label=1>否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col> -->
            </el-row>
            <div v-for="item in itemBeforeRuleList" :key="item.id">
              <el-row>
                <el-col :span="12">
                  <el-form-item
                    label="服务时间开始前"
                    :prop="'chargeBeforeTime' + item.id"
                    label-width="170px"
                  >
                    <div
                      style="display: flex; align-items: center; height: 36px"
                    >
                      <el-input
                        v-model="form['chargeBeforeTime' + item.id]"
                        onkeyup="value = value.replace(/[^\d.]/g, '')"
                        placeholder="请输入时间"
                        style="width: 222px"
                      />
                      <span class="unit">分钟内</span>
                    </div>
                  </el-form-item>
                </el-col>
                <el-col :span="10" style="display: flex">
                  <el-form-item
                    label="扣款比例"
                    :prop="'chargeBeforeScale' + item.id"
                  >
                    <div
                      style="display: flex; align-items: center; height: 36px"
                    >
                      <el-input
                        onkeyup="value = value.replace(/[^\d.]/g, '')"
                        v-model="form['chargeBeforeScale' + item.id]"
                        placeholder="请输入扣款比例"
                        style="width: 222px"
                      />
                      <span class="unit">%</span>
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="按项目实付金额计算"
                        placement="top"
                      >
                        <i class="el-icon-warning" style="color: #f7453e"></i>
                      </el-tooltip>
                    </div>
                  </el-form-item>
                </el-col>
                <el-col :span="2">
                  <div v-if="form.chargeBeforeType === 2">
                    <i
                      style="
                        cursor: pointer;
                        margin-left: 6px;
                        margin-top: 5px;
                        font-size: 20px;
                      "
                      v-if="itemBeforeRuleList.length > 1"
                      class="el-icon-remove-outline"
                      @click="del(item.id)"
                    ></i>
                    <i
                      style="
                        cursor: pointer;
                        margin-left: 6px;
                        margin-top: 5px;
                        font-size: 20px;
                      "
                      v-if="itemBeforeRuleList.length < 5"
                      class="el-icon-circle-plus-outline"
                      @click="add"
                    ></i>
                  </div>
                </el-col>
              </el-row>
            </div>
          </div>
          <!-- 项目开始后退单规则 -->
          <div>
            <el-row>
              <el-form-item label="服务时间开始后：" label-width="180px">
              </el-form-item>
            </el-row>
            <el-row>
              <!-- <el-col :span="12">
              <el-form-item label="是否扣费" label-width="170px">
                <el-radio-group v-model="form.chargebackType">
                  <el-radio  :label= 2>是</el-radio>
                  <el-radio  :label= 1>否</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col> -->
            </el-row>
            <div v-for="item in itemAfterRuleList" :key="item.id">
              <el-row>
                <el-col :span="12">
                  <el-form-item
                    label="服务时间开始后"
                    :prop="'chargebackTime' + item.id"
                    label-width="170px"
                  >
                    <div
                      style="display: flex; align-items: center; height: 36px"
                    >
                      <el-input
                        v-model="form['chargebackTime' + item.id]"
                        placeholder="请输入时间"
                        style="width: 222px"
                      />
                      <span class="unit">分钟内</span>
                    </div>
                  </el-form-item>
                </el-col>
                <el-col :span="10" style="display: flex">
                  <el-form-item
                    label="扣款比例"
                    :prop="'chargebackScale' + item.id"
                  >
                    <div
                      style="display: flex; align-items: center; height: 36px"
                    >
                      <el-input
                        v-model="form['chargebackScale' + item.id]"
                        placeholder="请输入扣款比例"
                        style="width: 222px"
                      />
                      <span class="unit">%</span>
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="按项目实付金额计算"
                        placement="top"
                      >
                        <i class="el-icon-warning" style="color: #f7453e"></i>
                      </el-tooltip>
                    </div>
                  </el-form-item>
                </el-col>
                <el-col :span="2">
                  <div v-if="form.chargebackType === 2">
                    <i
                      style="
                        cursor: pointer;
                        margin-left: 6px;
                        margin-top: 8px;
                        font-size: 20px;
                      "
                      v-if="itemAfterRuleList.length > 1"
                      class="el-icon-remove-outline"
                      @click="delAfter(item.id)"
                    ></i>
                    <i
                      style="
                        cursor: pointer;
                        margin-left: 6px;
                        margin-top: 8px;
                        font-size: 20px;
                      "
                      v-if="itemAfterRuleList.length < 5"
                      class="el-icon-circle-plus-outline"
                      @click="addAfter"
                    ></i>
                  </div>
                </el-col>
              </el-row>
            </div>
          </div>
        </div>
        <el-row>
          <el-col :span="12" style="display: flex">
            <el-form-item
              label="技师提成比例"
              prop="commissionRate"
              label-width="170px"
            >
              <div style="display: flex; align-items: center; height: 36px">
                <el-input
                  v-model="form.commissionRate"
                  placeholder="请输入技师提成比例"
                  style="width: 222px"
                />
                <span class="unit">%</span>
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="退款扣除金额，分%多少给技师"
                  placement="top"
                >
                  <i class="el-icon-warning" style="color: #f7453e"></i>
                </el-tooltip>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="退单说明" prop="status" label-width="170px">
              <el-input
                v-model="form.chargebackExplain"
                placeholder="请输入退单说明"
                style="width: 222px"
                type="textarea"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listchargeback,
  getchargeback,
  delitechargeback,
  addchargeback,
  updatechargeback,
  listMemberRegion,
  listMemberStore,
  editStatus,
} from "@/api/system/orderList/ChargebackRule";

export default {
  name: "Store",
  data() {
    return {
      map: null,
      local: null,
      mk: null,
      latitude: "",
      longitude: "",
      keyWords: "",
      result: "",
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 门店表格数据
      storeList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        storeId: null,
      },
      // 表单参数
      form: {
        chargebackWay: 1,
        chargeBeforeType: 2,
        chargeBeforeTime: "",
        chargeBackScale: "",
        chargebackType: 2,
        chargebackTime: "",
        chargebackScale: "",
      },
      itemBeforeRuleNumber: 0,
      itemBeforeRuleList: [{ id: 0 }],
      itemAfterRuleNumber: 0,
      itemAfterRuleList: [{ id: 0 }],
      pageNumber: 0,
      // 表单校验
      rules: {
        commissionRate: [
          { required: true, message: "请输入技师提成比例", trigger: "change" },
          {
            pattern: /^(?:[0-9]\d?|100)$/,
            message: "请输入正确提成比例",
            trigger: "change",
          },
        ],
        chargebackTime: [
          { required: true, message: "请输入分钟", trigger: "change" },
          {
            pattern: /^(?:[0-9]\d?|100)$/,
            message: "请输入正确数据",
            trigger: "change",
          },
        ],
        chargebackScale: [
          { required: true, message: "请输入扣款比例", trigger: "change" },
          {
            pattern: /^(?:[0-9]\d?|100)$/,
            message: "请输入正确数据",
            trigger: "change",
          },
        ],
      },
      options: [],
      List: [
        {
          key: 1,
          value: "启用",
        },
        {
          key: 2,
          value: "不启用",
        },
      ],
      Type: [
        {
          key: 1,
          value: "不扣费",
        },
        {
          key: 2,
          value: "扣费",
        },
      ],
      region: [],
      postione: [],
    };
  },
  created() {
    this.getList();
    this.getTimeRules("itemBeforeRuleList", "Before");
    this.getTimeRules("itemAfterRuleList", "back");
  },
  methods: {
    getTimeRules(dataList, name) {
      this[dataList] &&
        this[dataList].forEach((item, index) => {
          this.rules = {
            ...this.rules,
            [`charge${name}Time${item.id}`]: [
              { required: true, message: "请输入分钟", trigger: "change" },
              {
                pattern: /^(?:[0-9]\d?|100|[0-9]\d{2})$/,
                message: "请输入正确数据",
                trigger: "change",
              },
            ],
            [`charge${name}Scale${item.id}`]: [
              { required: true, message: "请输入扣款比例", trigger: "change" },
              {
                pattern: /^(?:[0-9]\d?|100)$/,
                message: "请输入正确扣款比例",
                trigger: "change",
              },
            ],
          };
        });
    },
    changePostione(value) {
      const selectedOption = this.postione.find((item) => item.key === value);
      const selectedKey = selectedOption.key;
      const selectedValue = selectedOption.value;
      this.form.storeName = selectedValue;
    },
    changeType(value) {
      const selectedOption = this.postione.find((item) => item.key === value);
      const selectedKey = selectedOption.key;
      const selectedValue = selectedOption.value;
      this.form.storeName = selectedValue;
    },
    /** 查询门店列表 */
    getList() {
      this.loading = true;
      listchargeback(this.queryParams).then((response) => {
        this.storeList = response.rows;
        this.storeList.map((item) => {
          if (item.chargebackWay === 1) {
            item.chargebackWay = "手动退单";
          } else {
            item.chargebackWay = "自动退单";
          }
        });
        this.total = response.total;
        this.loading = false;
      });
    },
    //添加项目开始前退单
    add() {
      this.itemBeforeRuleNumber += 1;
      this.itemBeforeRuleList.push({ id: this.itemBeforeRuleNumber });
      this.getTimeRules("itemBeforeRuleList", "Before");
    },
    //删除项目开始前退单
    del(id) {
      this.itemBeforeRuleList = this.itemBeforeRuleList.filter(
        (item) => item.id != id
      );
      console.log(id, this.itemBeforeRuleList, "55555");
    },
    //添加项目开始后退单
    addAfter() {
      this.itemAfterRuleNumber += 1;
      this.itemAfterRuleList.push({ id: this.itemAfterRuleNumber });
      this.getTimeRules("itemAfterRuleList", "back");
    },
    //删除项目开始前退单
    delAfter(id) {
      console.log(id, "8888888888");
      this.itemAfterRuleList = this.itemAfterRuleList.filter(
        (item) => item.id != id
      );
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        chargebackName: null,
        chargebackWay: 1,
        chargebackTime: null,
        chargebackScale: null,
        chargeBeforeType: 2,
        chargebackType: 2,
        commissionRate: null,
        chargebackExplain: null,
      };
      this.itemBeforeRuleNumber = 0;
      this.itemAfterRuleNumber = 0;
      this.itemBeforeRuleList = [
        {
          id: this.itemBeforeRuleNumber,
        },
      ];
      this.itemAfterRuleList = [
        {
          id: this.itemAfterRuleNumber,
        },
      ];
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      // this.resetForm("queryForm");
      this.queryForm = {
        pageNum: 1,
        pageSize: 10,
      };
      this.getList();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();

      this.open = true;
      this.title = "添加规则";
    },
    // 上下架
    handleGround(row, status) {
      const params = {
        id: row.id,
        storeId: row.storeId,
        status: status,
      };
      this.$confirm(
        `此操作将${status === 1 ? "启用" : "禁用"}该数据, 是否继续?`,
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          editStatus(params).then((res) => {
            this.$message({
              type: "success",
              message: `${status === 1 ? "启用" : "禁用"}成功!`,
            });
            this.getList();
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消禁用",
          });
        });
    },
    //切换退单方式
    handleChange(val) {
      if (val === 2) {
        this.itemBeforeRuleNumber = 0;
        this.itemAfterRuleNumber = 0;
        this.itemBeforeRuleList = [
          {
            id: this.itemBeforeRuleNumber,
          },
        ];
        this.itemAfterRuleList = [
          {
            id: this.itemAfterRuleNumber,
          },
        ];
        this.form = {
          ...this.form,
          chargebackTime: "",
          chargebackScale: "",
          chargeBeforeType: 2,
          chargebackType: 2,
        };
      } else {
        this.form = {
          ...this.form,
          chargebackTime: "",
          chargebackScale: "",
          chargeBeforeType: 2,
          chargebackType: 2,
        };
      }
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      const id = row.id || this.ids;
      getchargeback(id).then((response) => {
        const result = response.data;
        let timeForm = {};
        if (result.chargebackWay === 1) {
          //服务开始时间前
          this.itemBeforeRuleList =
            result.itemBeforeRule.itemBeforeRuleList.map((item, index) => {
              timeForm = {
                ...timeForm,
                ["chargeBeforeTime" + index]: item.chargebackTime,
                ["chargeBeforeScale" + index]: item.chargebackScale,
              };
              return {
                id: index,
              };
            });
          timeForm.chargeBeforeType = result.itemBeforeRule.chargebackType;
          this.itemBeforeRuleNumber =
            result.itemBeforeRule.itemBeforeRuleList.length - 1;
          //服务开始时间后
          this.itemAfterRuleList =
            result.itemAfterRule.itemAfterRuleList &&
            result.itemAfterRule.itemAfterRuleList.map((item, index) => {
              timeForm = {
                ...timeForm,
                ["chargebackTime" + index]: item.chargebackTime,
                ["chargebackScale" + index]: item.chargebackScale,
              };
              return {
                id: index,
              };
            });
          timeForm.chargebackType = result.itemAfterRule.chargebackType;
          this.itemAfterRuleNumber =
            result.itemAfterRule.itemAfterRuleList &&
            result.itemAfterRule.itemAfterRuleList.length - 1;
        }
        this.form = {
          ...result,
          ...timeForm,
        };
        this.getTimeRules("itemBeforeRuleList", "Before");
        this.getTimeRules("itemAfterRuleList", "After");
        this.open = true;
        this.title = "修改规则";
      });
    },
    getTimeList(name, listName) {
      let itemRuleList = [];
      this[`item${listName}RuleList`].forEach((item) => {
        itemRuleList.push({
          chargebackTime: this.form[`charge${name}Time` + item.id],
          chargebackScale: this.form[`charge${name}Scale` + item.id],
        });
      });
      // for(let key in this.form){
      //   if(key.includes(`charge${name}Time`)) {
      //     itemRuleList.push(
      //       {
      //         chargebackTime: this.form[key],
      //         chargebackScale: this.form[`charge${name}Scale` + key.split(`charge${name}Time`)[1]]
      //       }
      //     )
      //   }
      // }
      return {
        chargebackType: this.form[`charge${name}Type`],
        [`item${listName}RuleList`]: itemRuleList,
      };
    },

    /** 提交按钮 */
    submitForm() {
      const itemBeforeRule = this.getTimeList("Before", "Before");
      const itemAfterRule = this.getTimeList("back", "After");
      let params = {
        chargebackName: this.form.chargebackName,
        chargebackWay: this.form.chargebackWay,
        commissionRate: this.form.commissionRate,
        chargebackExplain: this.form.chargebackExplain,
        id: this.form.id || null,
      };
      if (this.form.chargebackWay === 2) {
        params = {
          ...params,
          chargebackTime: this.form.chargebackTime,
          chargebackScale: this.form.chargebackScale,
        };
      } else {
        params = {
          ...params,
          itemBeforeRule,
          itemAfterRule,
        };
      }
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.id != null) {
            updatechargeback(params).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addchargeback(params).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    handReset(row) {
      const ids = row.id || this.ids;
      this.$modal
        .confirm('是否确认重置门店编号为"' + ids + '"的数据项？')
        .then(function () {
          return listResetPwd({ userId: ids });
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("重置成功");
        })
        .catch(() => {});
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal
        .confirm('是否确认删除编号为"' + ids + '"的数据项？')
        .then(function () {
          return delitechargeback(ids);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "system/store/export",
        {
          ...this.queryParams,
        },
        `store_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>
<style>
.dialog-footer {
  text-align: center;
}
.unit {
  margin-left: 5px;
}
</style>
